<template>
  <div class="home">
      <NavBarRec/>
      <div>
        <keep-alive>
          <router-view  class="router-view" v-if="$route.meta.keepAlive" />
        </keep-alive>
        <router-view  class="router-view" v-if="!$route.meta.keepAlive" />
      </div>
  </div>

</template>

<script>
  import NavBarRec from "./childComps/per-recommend/childs/NavBarRec";

  export default {
    name: "Home",
    components:{
      NavBarRec,
    },

  }
</script>

<style scoped>
  .home{
    position: absolute;
    top: 44px;
    left: 137px;
    bottom: 50px;
    right: 2px;
    padding: 5px 20px;
  }
  /*对内容修剪设置滚动条*/
  /* 鼠标移到才显示滚动条*/
  .router-view:hover{
    /*overflow-y: auto;*/
    overflow-y: overlay;
  }
  /*对滚动区域设置*/
  .router-view{
    height: calc(100% - 44px - 50px);
    overflow-y: hidden;
  }
  /* 设置滚动条的样式 */
  ::-webkit-scrollbar {
    width:4px;
    background-color: #dcefef;
  }
  /* 滚动槽 */
 /* ::-webkit-scrollbar-track {
    border-radius:10px;
  }*/
  /* 滚动条滑块 */
  ::-webkit-scrollbar-thumb {
    border-radius:3px;
    background: #bbbbf1;
  }
</style>
